<!DOCTYPE html>
<html>
  <head>
    <title>JSTest5.html</title>
	
    <meta name="keywords" content="keyword1,keyword2,keyword3">
    <meta name="description" content="this is my page">
    <meta name="content-type" content="text/html; charset=UTF-8">

	<script type="text/javascript">
	
		/*获取元素的子节点*/
		window.onload = function(){
			var cityNode = document.getElementById("city");
			
			var cityLiNodes = cityNode.getElementsByTagName("li");//获取全部子节点
		//	alert(cityLiNodes.length);//3
			
			var beijing = cityNode.firstChild;//获取第一个子节点
		//	alert(cityFistChild);//[object Text]
			
			var guangzhou = cityNode.lastChild;//获取最后一个子节点
		//	alert(cityFistChild);//[object Text]
			
			
		/*	获取元素的文本值，文本节点一定时元素节点的子节点	*/
			var city = document.getElementById("beijing");
			var cityText = city.firstChild;
			alert(cityText.nodeValue);
			cityText.nodeValue = "wuhuan";
			
			alert(document.getElementById("beijing").firstChild.nodeValue);
		}
	</script>

  </head>
  
  <body>
  	<p>Which city do you like to live?</p>
  	<ul id="city">
  		<li id="beijing">BeiJing</li>
  		<li id="shanghai">ShangHai</li>
  		<li id="guangzhou">GuangZhou</li>
  	</ul>
  </body>
</html>
